import QtQuick 1.0

Rectangle {
    width: 360
    height: 640

    Text {
	id: myText

	text: "click a rectangle"
	width: parent.width

	font.pointSize: 15

	anchors.top: parent.top
	anchors.topMargin: 60

	anchors.horizontalCenter: parent.horizontalCenter
    }

    Rectangle {
	id: redRectangle

	color: "red"
	anchors.top: myText.bottom
	anchors.topMargin: 20
	width: parent.width
	height: 100

	ContextualMenu {
	    onItemClicked: myText.text = "clicked red item: " + index

	    model: ListModel {
		ListElement {name: "Red Item 0"}
		ListElement {name: "Red Item 1"}
		ListElement {name: "Red Item 2"}
	    }
	}
    }

    Rectangle {
	id: blueRectangle

	color: "blue"
	width: parent.width
	anchors.top: redRectangle.bottom
	anchors.topMargin: 20
	height: 100

	ContextualMenu {
	    onItemClicked: myText.text = "clicked blue item: " + index

	    model: ListModel {
		ListElement {name: "Blue Item 0"}
		ListElement {name: "Blue Item 1"}
		ListElement {name: "Blue Item 2"}
		ListElement {name: "Blue Item 3"}
		ListElement {name: "Blue Item 4"}
		ListElement {name: "Blue Item 5"}
		ListElement {name: "Blue Item 6"}
		ListElement {name: "Blue Item 7"}
		ListElement {name: "Blue Item 8"}
		ListElement {name: "Blue Item 9"}
		ListElement {name: "Blue Item 10"}
		ListElement {name: "Blue Item 11"}
		ListElement {name: "Blue Item 12"}
		ListElement {name: "Blue Item 13"}
		ListElement {name: "Blue Item 14"}
		ListElement {name: "Blue Item 15 (very long item description here!)"}
	    }
	}
    }

    Image {
	source: "close.png"
	anchors.right: parent.right
	anchors.top: parent.top
	anchors.margins: 10

	MouseArea {
	    anchors.fill: parent
	    onClicked: Qt.quit()
	}
    }

}
